{% extends "base.html" %}
{# Page des classements #}

{% block title %}{{ pageTitle}}{% endblock %}

{% block content %}
	<!-- test: <a href="?begin=1&pid=33&ice=0&penta=1&stp=0&country=13">lien test params</a> -->
	
	    <form action="" method="get"  class="clearfix-100">
		<div class="clearfix-100">
        <label>Track</label>
			{% for track in tracks %}
				<label class="track-radio">
					<input 
						class="track-radio" 
						style="display:none" 
						type="radio" 
						name="tid" 
						value="{{track.getId()}}" 
						onchange="submit()" 
						{%if trackSelected.getId() == track.getId() %}checked="checked"{%endif%} />
					{{track.getThumbImageHtml(40,40)|raw}}
				</label>
			{% endfor %}
		</div>
        <label class="label-left">Type
			<select name="type" onchange="submit()">        		
				{% for type in types %}
					{%if type.id == typeSelected %}                
						<option selected="selected" value="{{type.id}}">{{type.name}}</option>
					{% else %}
						<option value="{{type.id}}">{{type.name}}</option>
					{% endif %}
				{% endfor %}
			</select>
		</label>
        <label class="label-left">Mode
			<select name="mode" onchange="submit()">
				{% for mode in modes %}
					{%if mode.id == modeSelected %}
						<option selected="selected" value="{{mode.id}}">{{mode.mode}}</option>
					{% else %}
						<option value="{{mode.id}}">{{mode.mode}}</option>
					{% endif %}
				{% endfor %}
			</select>
		</label>
        <label class="label-left">Penta
			<input type="hidden" name="penta" value="off"/>
			<input type="checkbox" name="penta" value="on" {%if pentaSelected == 'on' %}checked="true"{% endif %} onchange="submit()" />
		</label>
		
		{% if countrySelected.getName() %}
			<input type="hidden" name="country" value="{{countrySelected.getId()}}" />
		{% endif %}
    	<input type="hidden" name="begin" value="{{begin}}" />
    	(<strong>{{nbTotalLines}}</strong> players on this ranking.)
		<div class="clearfix-100"></div>
    </form>
	
	
	{{trackSelected.getBannerImageHtml()|raw}}
	
	
    {#% if records %#}
<!--    <table class="ranking">-->
<!--    	<th>Rank</th>-->
<!--    	<th>Player</th>-->
<!--    	<th>Time</th>-->
<!--    	<th>Character</th>-->
<!--	-->
<!--		{% if modeSelected == 2 %}-->
<!--    	<th>STP</th>-->
<!--    	<th>Ice</th>-->
<!--		{% endif %}-->
<!--    	<th>Version</th>-->
<!--    	<th>Proof</th>-->
<!--    	<th>Date</th>-->

	<div class="standard-ranking-container">
		{% if records %}
		<div class="pagination-left">
			{%if begin>0 %}
				<a href="{{pagePreviousUrl}}"><img src="{{MEDIA_PATH}}img/icons/{{pagePreviousImg}}" /></a> 
			{% else %}
				<img src="{{MEDIA_PATH}}img/transparent.gif" />
			{% endif %}
		</div>
		<div class="standard-ranking">
	    {% for record in records %}
		{% if not(loop.last and records|length == nb+1) %}
				<div class="ranking_block">
					<div class="rank">{{ loop.index + begin }} {{ record.getPlayer().getCountry().getFlagHtml()|raw }} </div>
					<div class="nickname"><a href="profile.php?pid={{record.getPlayer().getId()}}">{{record.getPlayer().nickname}}</a></div>
					<pre style="display:inline">{{record.getTimeStr()}}</pre>
					<div class="proof">
					{% if record.getProof() %}
						<a href="{{ record.getProof().url }}">[OK-state={{ record.state }}]</a>
					{% endif %}
					</div>
					<div class="extra-infos">
						<div class="infos1">
							{{ record.getCharacter().getThumbImageHtml(30)|raw }}
							{% if modeSelected == 2 %}
							{% if record.stp %}[stp:YES]{% else %}[stp:NO]{% endif %}
							{% if record.ice %}[ice:YES]{% else %}[ice:NO]{% endif %}
							{% endif %}
							{{ record.getVersion().getImageHtml()|raw}}
						</div>
						<div class="clearfix"></div>
						<div class="infos2">
							<span class="date">{{ record.getDateDMY() }}<br />({{  record.getDateAgo() }} ago{%if record.getDateHi()!='00:00' %}, at {{ record.getDateHi() }}{%endif%})</span>
						</div>
					</div>
				</div>
		{% endif %}
		{% endfor %}
		</div>
		<div class="pagination-right">
			{%if records|length == nb+1 %}
				<a href="{{pageNextUrl}}"><img src="{{MEDIA_PATH}}img/icons/{{pageNextImg}}" /></a>
			{% else %}
				<img src="{{MEDIA_PATH}}img/transparent.gif" />
			{% endif %}
		</div>
		<div class="clearfix"></div>
		<div class="paginator">{{paginator|raw}}</div>
	    {% else %}
	    	No records
	    {% endif %}
	</div>
{% endblock content %}